<!DOCTYPE html>
<html lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Geolocation Components Demo - zoom effect</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,
    minimum-scale=1,maximum-scale=1,user-scalable=no">
    <style>
        * {margin: 0; padding: 0; border: 0;}
        body {
            position: absolute;
            width: 100%;
            height: 100%;
        }
        #geoPage, #markPage {
            position: relative;
        }
    </style>
</head>
<body>


<iframe id="mapPage" width="100%" height="100%" frameborder=0
        src="http://apis.map.qq.com/tools/locpicker?search=1&type=1&key=5MHBZ-H6G3U-EODVN-2QY3E-R2ZLQ-XTBJM&referer=myapp">
</iframe>

<script>
    var lll;
    window.addEventListener('message', function(event) {
        // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
        var loc = event.data;
        lll=loc;
        // console.log('location', loc);
        if (loc) {
            console.log(999);
            if (loc.module == "locationPicker"){
                console.log('location', loc.poiaddress);
                alert( JSON.stringify(loc,null,4));
            }
            ;
        };
    }, false);

</script>

</body>

</html>